import React, { Component } from "react";
import { nanoid } from "nanoid";
import "./index.css";

export default class index extends Component {
  handleAdd = ({ target, keyCode }) => {
    if (target.value) {
      if (keyCode === 13) {
        this.props.addTodo({ id: nanoid(), name: target.value, done: false });
        target.value = "";
      }
    }
  };
  render() {
    return (
      <div className="todo-header">
        <input
          onKeyUp={this.handleAdd}
          type="text"
          placeholder="请输入你的任务名称，按回车键确认"
        />
      </div>
    );
  }
}
